<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
	<title>机器人报名</title>
	<script src="js/mui.min.js"></script>
	<link href="css/mui.min.css" rel="stylesheet"/>
</head>
<body>
<header  class="mui-bar mui-bar-nav">
	<a href="javascript:history.back(-1)" class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
	<h1 class="mui-title">缴费</h1>
</header>
<div class="mui-content">
	<form id="payTeamInfo">
		<div class="title" style="margin-top: 15px;padding-left: 15px;">
			缴费队伍列表
		</div>
		<div class="mui-card" style="margin-bottom: 35px;">
			<ul class="mui-table-view team-list">
				
			</ul>
		</div>
		<div class="btn-area mui-button-row">
			<button id="pay-btn" type="button" class="mui-btn mui-btn-block mui-btn-success" style="padding: 6px 12px;">确认支付</button>
		</div>
	</form>
</div>
<script src="js/mui.min.js"></script>
<script src="js/jquery-1.9.1.min.js"></script>
<script src="http://res.wx.qq.com/open/js/jweixin-1.4.0.js"></script>
<script type="text/javascript">
	var order = JSON.parse(localStorage.getItem("order"));//获得队伍id
	// console.log(order);
	var html="";
	$(".team-list").empty();
	$.each(order.teamName,function(i,e){
		html+='<li class="mui-table-view-cell">'+e+'</li>'
	});
	$(".team-list").append(html);
	$(".team-list").append('<li class="mui-table-view-cell">' +
			'<span class="mui-pull-right">'+order.number*100+'元</span>' +
			'</li>');
	var wxConfig;
	var wxSignature;
	$.ajax({
		type: "get",
		url: "../wechat/order",
		data: {"teamIds":order.ids},
		dataType: "json",
		async:false,
		success: function(data){
			//mui.toast(data,{ duration:'2000', type:'div' });
			wxConfig=data.payInfo;
            wxSignature=data.signature;
			wx.config({
				debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
				appId: wxSignature.appId, // 必填，公众号的唯一标识
				timestamp: wxSignature.timestamp, // 必填，生成签名的时间戳
				nonceStr: wxSignature.nonceStr, // 必填，生成签名的随机串
				signature: wxSignature.signature,// 必填，签名
				jsApiList: ['checkJsApi', 'openLocation', 'getLocation','chooseWXPay'] // 必填，需要使用的JS接口列表
			});
		},
		error:function(e){
			mui.toast('缴费出现异常，请联系管理员'+e,{ duration:'2000', type:'div' });
		}
	});

	wx.ready(function(){
		//支付
		mui(".btn-area").on('tap','#pay-btn',function(){
			wx.chooseWXPay({
				timestamp: wxConfig.timeStamp, // 支付签名时间戳，注意微信jssdk中的所有使用timestamp字段均为小写。但最新版的支付后台生成签名使用的timeStamp字段名需大写其中的S字符
				nonceStr: wxConfig.nonceStr, // 支付签名随机串，不长于 32 位
				package: wxConfig.packageValue, // 统一支付接口返回的prepay_id参数值，提交格式如：prepay_id=\*\*\*）
				signType: wxConfig.signType, // 签名方式，默认为'SHA1'，使用新版支付需传入'MD5'
				paySign: wxConfig.paySign, // 支付签名
				success: function (res) {
					// 支付成功后的回调函数
					mui.toast(res,{ duration:'2000', type:'div' });
				}
			});
		});

	});
</script>
</body>
</html>
